<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>BCovrin Indy Network</title>
  <link href="include/css/index.css" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
  <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
  <script type="text/javascript"
      src="https://code.jquery.com/jquery-3.2.1.min.js"
      integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
      crossorigin="anonymous"></script>
</head>
<body>
  <header>
    <h1>BCovrin</h1>
    <p class="lead">BC's Provisional Indy Network</p>
  </header>

  <main>
    <div class="row-outer">
      <div class="col-main">
        <div class="panel panel-default panel-node-status">
          <div class="panel-heading">
            <h2>
              <span class="fa fa-tachometer"></span>
              Validator Node Status
            </h2>
          </div>
          <div class="panel-body">
            <div class="panel panel-node">
              <div class="panel-body loading">
                <p>
                  <span class="fa fa-circle-o-notch fa-spin fa-fw"></span> Loading status ...
                </p>
              </div>
              <div class="panel-body error" style="display: none">
                <p>
                  <span class="fa fa-warning"></span> Error loading validator node status.
                </p>
              </div>
              <div class="panel-body warning not-ready" style="display: none">
                <p>
                  <span class="fa fa-warning"></span> Trust anchor is not yet initialized.
                </p>
              </div>
              <div class="panel-body node-status template">
                <div class="node-status-left">
                  <label class="node-name"><span class="nodeval-name">Node1</span></label>
                  <div class="node-indicator">
                    <svg width="100%" height="100%" viewBox="0 0 120 120">
                        <circle cx="60" cy="60" r="54" fill="none" stroke="#e6e6e6" stroke-width="12" />
                        <circle class="progress-circle" cx="60" cy="60" r="54" fill="none" stroke="#80DDE6" stroke-width="12"
                            stroke-linecap="round" stroke-dasharray="339.292" stroke-dashoffset="339.292" transform="rotate(-90, 60, 60)" />
                    </svg>
                  </div>
                </div>
                <div class="node-status-right">
                  <dl class="props">
                    <dt>Node properties</dt>
                    <dd class="node-did"><label>DID:</label> <code class="nodeval-did">8ECVSk179mjsjKRLWiQtssMLgp6EPhWXtaYyStWPSGAb</code></dd>
                    <dd class="node-state" style="display: none"><label>State:</label> <span class="nodeval-state">unknown</span></dd>
                    <dd class="node-uptime"><label>Uptime:</label> <span class="nodeval-uptime">6 days, 11 hours, 9 minutes, 35 seconds</span></dd>
                    <dd class="node-txns"><label>Transactions:</label> <span class="nodeval-txns">0 config, 46 ledger, 4 pool, 0.00/s read, 0.00/s write</span></dd>
                    <dd class="node-unreach"><label>Unreachable hosts:</label> <span class="nodeval-unreach">Node2, Node3</span></dd>
                    <dd class="node-indyver"><label>indy-node version:</label> <span class="nodeval-indyver">1.2.210</span></dd>
                  </dl>
                </div>
              </div>
            </div>
            <p>
              View detailed information about the status of the running validator nodes:
            </p>
            <p>
              <a href="/status/text" class="tool"><span class="fa fa-chevron-right left"></span>Detailed Status</a>
            </p>
          </div>
        </div>

        <div class="panel panel-default panel-ledger-status">
          <div class="panel-heading">
            <h2>
              <span class="fa fa-sitemap"></span>
              Ledger State
            </h2>
          </div>
          <div class="panel-body">
            <p>
              View the state of the ledgers:
            </p>
            <p>
              <a href="/ledger/domain" class="tool"><span class="fa fa-chevron-right left"></span>Domain</a> <span class="tool-tag">JSON</span>
              <br>
              <a href="/ledger/pool" class="tool"><span class="fa fa-chevron-right left"></span>Pool</a> <span class="tool-tag">JSON</span>
              <br>
              <a href="/ledger/config" class="tool"><span class="fa fa-chevron-right left"></span>Config</a> <span class="tool-tag">JSON</span>
              <br>
              <a href="https://kumu.io/maher-bouidani/bc-govern" class="tool"><span class="fa fa-chevron-right left"></span>Domain graph example</a>
            </p>
          </div>
        </div>
      </div>

      <aside class="col-tools">
        <div class="panel panel-side connect">
          <div class="panel-heading">
            <h2>
              <span class="fa fa-plug"></span>
              Connect to the Network
            </h2>
          </div>
          <div class="panel-body">
            <p>
              Download the genesis transaction file to connect to the network.
            </p>
            <p>
              <a href="/genesis" class="tool-button"><span class="fa fa-download left"></span>Genesis Transaction</a>
              <span class="tool-tag">JSON</span>
            </p>
          </div>
        </div>


        <div class="panel panel-side authorize">
          <div class="panel-heading">
            <h2>
              <span class="fa fa-key"></span>
              Authenticate a New DID
            </h2>
          </div>
          <div class="panel-body">
            <p>
              Easily write a new DID to the ledger for new identity owners.
            </p>
<!--             <p>
              <span class="top-label">Format:</span><br><code class="tag small">/register?seed=BC-Registrar-Agent-0000000000000</code>
            </p> -->
            <p>

              <form action="/register" method="get" accept-charset="utf-8">
                <select name="seed" class="tool-button">
                  <option value="the_org_book_dev_000000000000000">TheOrgBook (DEV)</option>
                  <option value="the_org_book_test_00000000000000">TheOrgBook (TEST)</option>
                  <option value="bc_registries_dev_00000000000000">BC Corporate Registry (DEV)</option>
                  <option value="bc_registries_test_0000000000000">BC Corporate Registry (TEST)</option>
                  <option value="city_of_surrey_dev_0000000000000">City of Surrey (DEV)</option>
                  <option value="city_of_surrey_test_000000000000">City of Surrey (TEST)</option>
                  <option value="fraser_valley_dev_00000000000000">Fraser Valley Health Authority (DEV)</option>
                  <option value="fraser_valley_test_0000000000000">Fraser Valley Health Authority (TEST)</option>
                  <option value="liquor_control_dev_0000000000000">Liquor Control and Licensing Branch (DEV)</option>
                  <option value="liquor_control_test_000000000000">Liquor Control and Licensing Branch (TEST)</option>
                  <option value="ministry_of_finance_dev_00000000">BC Ministry of Finance (DEV)</option>
                  <option value="ministry_of_finance_test_0000000">BC Ministry of Finance (TEST)</option>
                  <option value="worksafe_bc_dev_0000000000000000">WorkSafe BC (DEV)</option>
                  <option value="worksafe_bc_test_000000000000000">WorkSafe BC (TEST)</option>
                </select>
                or
                <input
                  maxlength="32"
                  class="tool-input"
                  type="text"
                  name="seed"
                  placeholder="Wallet Seed (32 characters)"
                >
                <br/>
                <button class="tool-button" type="submit" name="register"><span class="fa fa-sign-in left"></span>Register DID</button>
              </form>


              <code class="register-result">
                <h3>Identity successfully registered:</h3>
                <b>seed: </b> <span id="seed"></span> <br />
                <b>did: </b> <span id="did"></span> <br />
                <b>verkey: </b> <span id="verkey"></span> <br />
              </code>

            </p>
          </div>
        </div>
      </aside>
    </div>
  </main>

  <script src="include/js/index.js" type="text/javascript"></script>
</body>
</html>

